import DemoBoxContent from '@/components/docs/DemoBoxContent'

const BreakpointsMediaQueries = () => {
    return (
        <div className="grid grid-cols-1 md:grid-cols-6 gap-4">
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                01
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                02
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                03
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                04
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                05
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                06
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                07
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                08
            </DemoBoxContent>
            <DemoBoxContent className="shadow-lg bg-cyan-500">
                09
            </DemoBoxContent>
        </div>
    )
}

export default BreakpointsMediaQueries
